<!-- 模块说明 -->
<template>

    <div>
        <van-nav-bar title="出售" />
    </div>

    <div class="proce">
        <span class="sell">出售流程</span>
        <ol>
            <li>卖家在个人设置里完成实名认证申请</li>
            <li>卖家发布书籍</li>
            <li>买家下的那支付后卖家填写快递信息发货</li>
            <li>订单确认收获后，卖家在个人账户余额里进行提现</li>
        </ol>
        <router-link replace to="/examine">
            <span class="sell">审核规则</span>
        </router-link>
    </div>

    <div class="link">
        <!-- <van-button type="primary" text="显示遮罩层"  /> -->
        <span @click="show = true" class="txt2"> 手动输入ISBN </span>

        <van-overlay :show="show">
            <div class="bigbn">
                <div class="tit">
                    <span>请输入ISBN</span>
                    <div style=" width: 40px;" @click="show = false" @click.stop>
                        <img src="../../img/取消.png" alt="" />
                    </div>
                </div>
                <div class="tit2">
                    <div class="small">
                        <span>9787开始的13位ISBN编码,不含-符号</span>
                    </div>

                    <div>
                        <img src="../../img/条形码.png" alt="" />
                    </div>
                    <div>
                        <input type="text"
                             onfocus="this.placeholder=''" 
                              onblur="this.placeholder='请输入13位ISBN编码'"
                                 >
                    </div>
                    <div>
                        <!-- <input type="submit"> -->
                        <button>确定</button>
                    </div>
                </div>
            </div>
        </van-overlay>

        <!-- 设置完学校 -->
        <!-- <van-overlay :show="show" @click="show = false">
            <div class="wrapper" @click.stop>
                <div class="block" @click.stop>
                    <div class="big">
                        <span class="tishi">您在的学校信息还未设置，请先在个人设置里设置学校信息</span>
                        <div class="xuanx">
                            <router-link to="school">立即设置</router-link>
                            <span @click.stop :show="show" @click="show = false">暂不设置</span>
                        </div>
                    </div>
                </div>
            </div>
        </van-overlay> -->

        <div style="margin-top: 15px; display: flex;flex-direction: column;  ">
            <router-link class="txt2" to="batch">如何批量出售?</router-link>
        </div>


    </div>

</template>

<script setup>


import { ref } from 'vue';
const show = ref(false);
//   mounted() {
//         console.log(this.$route, "$routecenter");
//     }



</script>

<style lang="scss" scoped>
.wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.block {
    width: 270px;
    height: 120px;
    background-color: #fff;
}


.sell,
li {
    border-bottom: 0.5px solid #ddd;
    font-size: 12px;
    width: 100%;
    line-height: 30px;
}

span {
    display: block;

}

ol li {
    list-style-type: decimal;
    list-style-position: inside;
    color: #555;
}



.big {
    font-size: 10px;
    width: 100%;
    height: 100%;
    background: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;


}

.link {
    display: flex;
    flex-direction: column;
    // justify-content: center;
    align-items: center;
    line-height: 25px;
    margin-top: 30px;
    font-size: 12px;

}

.txt1,
.txt2 {
    color: #d3ab6d;
    font-size: 14px;
    line-height: 25px;
}

.tishi {
    font-size: 14px;
    width: 245px;


}

.proce {
    margin-left: 8px;
}

.xuanx {
    display: flex;
    justify-content: space-between;
    width: 245px;
    line-height: 50px;

}

.sell {
    color: #000;
}

.xuanx span {
    width: 40px;
    color: #009485;

}

.bigbn {
    width: 330px;
    height: 280px;
    border-radius: 5px;
    background: #fff;
    margin: 0 auto;
    margin-top: 100px;

    .tit {
        border-bottom: 0.5px solid #d5d5d5;
        font-size: 16px;
        font-weight: 500;
        line-height: 45px;
        display: flex;
        justify-content: space-between;

        span {
            // background: #009485;
            width: 120px;
            text-align: center;
        }

        img {
            width: 15px;
            height: 15px;
            vertical-align: middle;
            // margin: auto;
            // text-align: center;
            // line-height: 15px;
        }
    }

    .tit2 {
        display: flex;
        flex-direction: column;
        // justify-content: center;
        align-items: center;

       
        .small {
            color: #555;
            font-size: 13px;
            margin-top: 15px;
            // line-height: 35px;
        }

        img {
            width: 130px;
            height: 80px;

        }

        input {
            border: 0.5px solid #cbc6c6;
            height: 35px;
            width: 270px;
            border-radius: 5px;
            font-size: 14px;
            color: #999;
        }

        button {
            background: #d3ab6d;
            // box-shadow: none;
            border-radius: 20px;
            // display: inline-block;
            color: #fff;
            width: 130px;
            height: 35px;
            border: 5px;
            margin-top: 20px;
        }

        button:active {
            color: #FFEFDEC2;
        }
    }
}
</style>